<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    /*事件 就是文档或者浏览器窗口中发生的一些特定的交互瞬间
    *   JavaScript与HTML之间的交互是通过事件实现的
    *   对于web应用来说，有下面这些代表性的事件，点击某个元素，将鼠标移动至某个元素上方，
    *       按下键盘上的某个键等
    *   事件就是用户和浏览器之间的交互行为
    *   1.我们可以对事件对象的属性设置一些JS代码，事件被触发时这些代码将被执行
    *       这种写法我们称为结构和行为耦合，不方便维护 不推荐使用
    *   2.获取事件的对象，添加
    *       我们可以为按钮的对应事件绑定处理函数的形式来响应事件
    *       绑定一个单击事件，像这种为单击事件绑定的函数 我们称为单击响应函数
    *
    *
    *
    *
    *
     */
</script>
<button id="btn" onclick="alert('你好')">这是一个大按钮</button><!--第1种方法不推荐使用-->
<button id="btn1" onMouseMove="alert('欢迎回来')">这是一个小按钮</button> <!--第1种方法 不推荐使用-->
<button id="btn2" >这是按钮</button>
<hr>
<script>
    /*我们可以为按钮的对应事件绑定处理函数的形式来响应事件
    *
    */
    //获取对象
    var btn2=document.getElementById("btn2");
        console.log(btn2);
        //绑定一个单击事件，像这种为单击事件绑定的函数 我们称为单击响应函数
    btn2.onclick=function () {//创建事件函数
    alert("哈哈 我出口来了");
    };
</script>
</body>
</html>